<template>
  <div class="aa-container">
    <div class="textarea-con" :class="{'validate-err': errors.has('engineeringContent')}">
      <label data-content="工程项目主要内容、工作量*">工程项目主要内容、工作量*&nbsp;&nbsp;&nbsp;<span class="lg-promp">不超过600字</span></label>
      <textarea rows="3" class="width-full" v-model="projectintroduce.engineeringContent"
      v-validate="'required|min:1|max:600'" name="engineeringContent"></textarea>
    </div>
    <div class="textarea-con" :class="{'validate-err': errors.has('technologyInstructions')}">
      <label data-content="工程项目主要技术特点、工艺流程、性能指标、质保措施*">工程项目主要技术特点、工艺流程、性能指标、质保措施*&nbsp;&nbsp;&nbsp;<span class="lg-promp">不超过2000字</span></label>
      <textarea rows="3" class="width-full" v-model="projectintroduce.technologyInstructions"
      v-validate="'required|min:1|max:2000'" name="technologyInstructions"></textarea>
    </div>
    <div class="textarea-con" :class="{'validate-err': errors.has('instructions')}">
      <label data-content="验收单位、被检成果优良级品率*">验收单位、被检成果优良级品率*&nbsp;&nbsp;&nbsp;<span class="lg-promp">不超过100字</span></label>
      <textarea rows="3" class="width-full" v-model="projectintroduce.instructions"
      v-validate="'required|min:1|max:100'" name="instructions"></textarea>
    </div>
    <div class="textarea-con" :class="{'validate-err': errors.has('resultInstructions')}">
      <label data-content="成果检验机构的单位名称、检验方式、检验结论*">成果检验机构的单位名称、检验方式、检验结论*&nbsp;&nbsp;&nbsp;<span class="lg-promp">不超过100字</span></label>
      <textarea rows="3" class="width-full" v-model="projectintroduce.resultInstructions"
      v-validate="'required|min:1|max:100'" name="resultInstructions"></textarea>
    </div>
  </div>
</template>

<script>
  export default {
    title: '工程项目介绍',
    name: 'project-introduce',
    props: {
      data: {}
    },
    data () {
      return {
        projectintroduce: {}
      }
    },
    methods: {
      validate () {
        return this.$validator.validateAll()
      }
    },
    mounted () {
      this.projectintroduce = Object.assign({}, this.data)
    },
    watch: {
      'projectintroduce': {
        handler: function (val, oldVal) {
          this.$emit('update:data', this.projectintroduce)
        },
        deep: true
      }
    }
  }
</script>
